<template>
    <div>
        <h2>pinia</h2>
         用户名: {{name}}<br/>
         年龄: {{age}}<br/>
         性别: {{sex}}<br/>
         getters: 新的age{{getAddAge}}<br/>
         getters中使用getters: 新的数据{{getNameAndAge}}<br/>
         getters接收参数: 新的数据1==={{getAddAge1(200)}}
         <div>
           <button @click="changeName">修改用户名</button>
           <button @click="reset">重置state</button>
         </div>
    </div>
</template>
<script setup lang='ts'>
import { useUserStore } from '@/stores/user'
import { storeToRefs } from 'pinia'
let store = useUserStore()
const { name, age, sex, getAddAge, getNameAndAge, getAddAge1} = storeToRefs(store)
const changeName = () => {
    // store.name = '王五'
    // store.age = 19
    // store.sex = '女'
    // console.log("store==", store)
    // 批量修改
    // store.$patch({
    //    name: '王五',
    //    age: 19,
    //    sex: '女'
    // })
    // 批量修改2 -- 推荐
    store.$patch(state => {
       state.name = '王五3333'
       state.sex = '男'
       state.age = 20
    })
}

// reset 重置state
const reset =() => {
  store.$reset()
}

</script>


<style lang='scss' scoped>

</style>